<#--
<!DOCTYPE html>
<html lang="en">
<head>
    <meta charset="UTF-8">
    <meta http-equiv="X-UA-Compatible" content="IE=edge,chrome=1">
    <title>充值</title>
    <link rel="stylesheet" href="/css/reset.css">
    <link rel="stylesheet" href="/css/common.css">
    <link rel="stylesheet" href="/css/recharge.css">
    <link rel="stylesheet" href="/css/user_siderbar.css">
    <script type="text/javascript" src="/js/assets/config.js"></script>
    <script type="text/javascript" src="/js/assets/require.js" data-main="/js/users/recharge"></script>
</head>
<body>
<#include "/include/header.ftl">
<div class="container clear">

<#include "/include/user_siderbar.ftl">
    <div class="content fr">
        <div class="recharge-title">
            <div class="recharge-title-left">
                充值
            </div>
            <div class="recharge-title-right">
                <div class="record-but">
                    <a href="/account/recharge/rechargeRecord?-1?3?0">
                        <button class="but">
                            充值记录
                        </button>
                    </a>
                </div>
            </div>
        </div>
        <div class="recharge-main">
            <div class="recharge-bankCard">
                <div class="third-pay">
                    <div class="third-pay-title">
                        开户银行：
                    </div>
                    <p class="recharge_input_wrap2">
                        <img src="/img/shanbanongcunyinhangchongzhi.png">
                    </p>
                </div>
                <div class="third-pay">
                    <div class="third-pay-title">
                        开户姓名：
                    </div>
                    <p class="recharge_input_wrap1">
                        <input type="text" class="recharge-input1" id="banName" disabled="disabled"/></p>
                </div>
                <div class="third-pay">
                    <div class="third-pay-title">
                        存管账户：
                    </div>
                    <p class="recharge_input_wrap1">
                        <input type="text" class="recharge-input1" id="bankCardNum" disabled="disabled"/></p>
                </div>

                <div class="third-pay">
                    <div class="third-pay-title">
                        充值金额：
                    </div>
                    <p class="recharge_input_wrap">
                        <input type="text" class="recharge-input" id="rechargeAmount" maxlength="12"/></p>
                </div>
                <div class="third-pay">
                    <div class="third-pay-title">
                        验证码：
                    </div>
                    <input type="text" class="recharge-input" id="pictureCode" maxlength="4"  onkeyup="this.value=this.value.replace(/\D/g,'')" onafterpaste="this.value=this.value.replace(/\D/g,'')"
                           style="margin-top: 18px;margin-left: 10px;float: left"/>

                    <div class="verification-img">
                        <img src="/sys/ImageServlet" id="validImg" style="cursor:pointer;"/>
                    </div>
                </div>
                <div class="third-pay">
                    <button id="rechargeBut" class="recharge-but">
                        确认充值
                    </button>
                </div>
                <div class="prompt">
                    <div class="prompt-content">
                        <div class="prompt-content-title">
                            温馨提示
                        </div>
                        <div class="prompt-content-text">
                            <div class="prompt-content-img">
                                <img src="/img/promptImg.png" style="margin-top: 12px"/>
                            </div>
                            <div class="prompt-text">
                                为保障资金安全，充值提现采用同卡进出原则，即提现银行卡需与充值银行卡一致。
                            </div>
                        </div>
                        <div class="prompt-content-text">
                            <div class="prompt-content-img">
                                <img src="/img/promptImg.png" style="margin-top: 12px"/>
                            </div>
                            <div class="prompt-text">
                                为了您的账户安全，请在充值前进行实名认证、银行卡绑定以及交易密码设置。
                            </div>
                        </div>
                        <div class="prompt-content-text">
                            <div class="prompt-content-img">
                                <img src="/img/promptImg.png" style="margin-top: 12px"/>
                            </div>
                            <div class="prompt-text">
                                充值前请确认您的银行卡限额。如充值成功后未能及时到账，请联系客服：400-0571-909。
                            </div>
                        </div>
                    </div>
                </div>
            </div>
        </div>
    </div>

</div>

<#include "/include/smalldetails.ftl">
<#include "/include/footer.ftl">
</body>
</html>-->
<!DOCTYPE html>
<html lang="en">
<head>
    <meta charset="UTF-8">
    <meta http-equiv="X-UA-Compatible" content="IE=edge,chrome=1">
    <title>充值</title>
    <link rel="stylesheet" href="/css/reset.css">
    <link rel="stylesheet" href="/css/common.css">
    <link rel="stylesheet" href="/css/recharge.css">
    <link rel="stylesheet" href="/css/user_siderbar.css">
    <link rel="stylesheet" href="/css/Pay_the_password.css">
    <script type="text/javascript" src="/js/assets/config.js"></script>
    <script type="text/javascript" src="/js/assets/require.js" data-main="/js/users/recharge"></script>
    <style>
        .choicechongzhi {
            height: 40px;
            padding-left: 69px;
            margin-bottom: 30px;
        }

        .choicechongzhi li {
            display: inline-block;
            font-size: 20px;
            height: 40px;
            width: 120px;
            line-height: 40px;
            text-align: center;
            cursor: pointer;
            color: #767676;
        }

        .choicechongzhi .liactive {
            background: RGB(44, 151, 244);
            color: rgb(255, 255, 255);
            border-radius: 3px;
        }

        .alieditContainer .i-text {
            position: absolute;
            color: #fff;
            opacity: 0.2;
            width: 100%;
            height: 48px;
            font-size: 12px;
            left: 0;
            -webkit-user-select: initial;
            z-index: 9;
            padding: 0;
            border: 0;
            top: -3px;
        }

        .content {
            position: relative;
        }

        .add {
            position: absolute;
            width:350px;
            height: 600px;
            right: 129px;
            top: 224px;
        }
        .rebox-whole-options {
            width: 100%;
            height: 228px;
            background: #ffffff;
            border: none;
            border-radius: 5px;
        }



        /*银行卡和限额表的样式*/
        .limit{
            width: 350px;
            height: 154px;
            border: solid 1px #dbdbdb;
            float: left;
            border-radius: 5px;
            margin-left: 52px;
            margin-top: 20px;
        }
        .limit-title{
            width: 100%;
            height: 44px;
            background: #eaeaea;
            font-size: 16px;
            color: #545454;
            line-height: 44px;
            padding-left: 30px;
        }
        .limit-whole{
            width: 100%;
            height: 54px;
            border-bottom: solid 1px #e5e5e5;
            line-height: 54px;
            font-size: 16px;
            color: #868686;
            padding-left: 30px;
        }
        .lookXianEdu{
            display: inline-block;
            float: right;
            margin-right:20px;
            height:30px;
            width:100px;
            text-align: center;
            line-height:30px;
            margin-top:6px;
            font-size:14px;
            color: rgb(255, 255, 255);
            border-radius:30px;
            background:RGB(44,151,244);
            cursor: pointer;
        }

        .bankAlertBox{
            width: 100%;
            height: 100%;
            position: fixed;
            z-index: 100;
            left: 0;
            top: 0;
            background-color: rgba(0, 0, 0, 0.2);
        }
        .bankBox{
            width: 600px;
            height: auto;
            border-radius: 20px;
            position: absolute;
            left: 50%;
            top: 20%;
            margin-left: -300px;
            padding-bottom: 10px;
            background-color: #f5f5f5;
            overflow: hidden;
        }
        .bankBox .title{
            width: 100%;
            height: 60px;
            line-height: 60px;
            text-align: center;
            border-right: 0 none;
            color: #333;
            border-bottom: 1px solid #e8e8e8;
            background-color: #fff;
        }
        .bankBox .title li{
            float: left;
            width: 33.33333%;
        }
        .bankBox .text{
            width: 100%;
            height: 40px;
            line-height: 40px;
            text-align: center;
            color: #555;
            font-size: 14px;
        }
        .bankBox .text li{
            float: left;
            width: 33.33333%;
        }
        .close {
            position: absolute;
            top: 12px;
            color: white;
            left: calc(50% + 267px);
            width: 20px;
            height: 20px;
            border-radius: 30px;
            line-height: 20px;
            text-align: center;
            z-index: 1000;
            background: RGBA(131,131,131,.8);
            cursor: pointer;
        }
        .rebox1{
            width: 100%;
            height:
            100%;
            background: rgba(0,0,0,0.2);
            position: fixed;
            left:0;
            top:0;
            bottom:0;
            right:0;
            z-index:2;
        }

    </style>
</head>
<body>
<#include "/include/header.ftl">
<div class="container clear">

<#include "/include/user_siderbar.ftl">
    <div class="bankAlertBox" hidden>
        <div class="bankBox">

        </div>
    </div>
    <div class="content fr" style="position: relative">
        <div class="recharge-title">
            <div class="recharge-title-left">
                充值
            </div>
            <div class="recharge-title-right">
                <div class="record-but">
                    <a href="/account/recharge/rechargeRecord?-1?3?0">
                        <button class="but">
                            充值记录
                        </button>
                    </a>
                </div>
            </div>
        </div>
        <div class="add" hidden>
            <div class="bankCard">
                <div class="bankCard-title">
                    <div class="bankCard-title-icon">

                    </div>
                    <div class="bankCard-text"><span class="bankCardName"></span></br><span style="font-size: 18px;
                    "class="bankCardType">储蓄卡</span></div>

                </div>
                <div class="bankCard-num">
                    <span style="line-height: 10px" class="bankCard-num"></span>
                </div>
            </div>
            <div class="limit">
                <div class="limit-title">
                    充值限额
                    <span class="lookXianEdu">充值限额表</span>
                </div>
                <div class="limit-whole">
                    单笔限额&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;<span class="panMoney"></span>
                </div>
                <div class="limit-whole" style="border-bottom: none">
                    日限额&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;<span class="panMoney"></span>
                </div>
            <#-- <div class="limit-whole" style="border: none">
                 月限额&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;<span class="monthMoney"></span>
             </div>-->
            </div>
        </div>


        <ul class="choicechongzhi">
            <li class="wangyinchongzhi liactive" id="1">网银充值</li>
            <li class="kuaijiechongzhi" id="2">快捷充值</li>
        </ul>
        <div class="recharge-main">
            <div class="recharge-bankCard">
                <div class="kuaijiechongzhidiv" hidden>
                    <div class="third-pay">
                        <div class="third-pay-title">
                            开户银行：
                        </div>
                        <p class="recharge_input_wrap2">
                            <img src="/img/shanbanongcunyinhangchongzhi.png">
                        </p>
                    </div>
                    <div class="third-pay">
                        <div class="third-pay-title">
                            开户姓名：
                        </div>
                        <p class="recharge_input_wrap1">
                            <input type="text" class="recharge-input1" id="banName" disabled="disabled"/></p>
                    </div>
                    <div class="third-pay">
                        <div class="third-pay-title">
                            存管账户：
                        </div>
                        <p class="recharge_input_wrap1">
                            <input type="text" class="recharge-input1" id="bankCardNum" disabled="disabled"/></p>
                    </div>
                </div>
                <div class="third-pay">
                    <div class="third-pay-title">
                        充值金额：
                    </div>
                    <p class="recharge_input_wrap">
                        <input type="text" class="recharge-input" id="rechargeAmount" maxlength="11"/></p>
                </div>
                <div class="third-pay  third-pay1">
                    <div class="third-pay-title">
                        验证码：
                    </div>
                    <input type="text" class="recharge-input" id="pictureCode" maxlength="4"
                           onkeyup="this.value=this.value.replace(/\D/g,'')"
                           onafterpaste="this.value=this.value.replace(/\D/g,'')"
                           style="margin-top: 18px;margin-left: 10px;float: left"/>

                    <div class="verification-img">
                        <img src="/sys/ImageServlet" id="validImg" style="cursor:pointer;"/>
                    </div>
                </div>
                <div class="third-pay">
                    <button id="rechargeBut" class="recharge-but">
                        确认充值
                    </button>
                    <button id="rechargeBut1" class="recharge-but" hidden>
                        确认充值
                    </button>
                </div>
                <div class="prompt">
                    <div class="prompt-content">
                        <div class="prompt-content-title">
                            温馨提示
                        </div>
                        <div class="prompt-content-text">
                            <div class="prompt-content-img">
                                <img src="/img/promptImg.png" style="margin-top: 12px"/>
                            </div>
                            <div class="prompt-text">
                                预计5-10分钟到账,如有问题请联系客服。
                            </div>
                        </div>

                        <div class="prompt-content-text">
                            <div class="prompt-content-img">
                                <img src="/img/promptImg.png" style="margin-top: 12px"/>
                            </div>
                            <div class="prompt-text">
                                为保障资金安全，充值提现采用同卡进出原则，即提现银行卡需与充值银行卡一致。
                            </div>
                        </div>
                        <div class="prompt-content-text">
                            <div class="prompt-content-img">
                                <img src="/img/promptImg.png" style="margin-top: 12px"/>
                            </div>
                            <div class="prompt-text">
                                为了您的账户安全，请在充值前进行实名认证、银行卡绑定以及交易密码设置。
                            </div>
                        </div>
                        <div class="prompt-content-text">
                            <div class="prompt-content-img">
                                <img src="/img/promptImg.png" style="margin-top: 12px"/>
                            </div>
                            <div class="prompt-text">
                                充值前请确认您的银行卡限额。如充值成功后未能及时到账，请联系客服：400-0571-909。
                            </div>
                        </div>
                    </div>
                </div>
            </div>
        </div>
    </div>
</div>
<div class="rebox1 display">
    <div class="rebox-whole">
        <div class="rebox-whole-options">
            <div class="rebox-whole-title">
                支付密码
            </div>
            <div class="alieditContainer" id="payPassword_container" style="margin-bottom:18px;">
                <input minlength="6" maxlength="6" tabindex="1" id="payPassword_rsainput" name="payPassword_rsainput"
                       class="ui-input i-text" oncontextmenu="return false" onpaste="return false" oncopy="return false"
                       oncut="return false" autocomplete="off" value="" type="password">

                <div class="sixDigitPassword" tabindex="0">
                    <i><b></b></i>
                    <i><b></b></i>
                    <i><b></b></i>
                    <i><b></b></i>
                    <i><b></b></i>
                    <i><b></b></i>
                    <span class="guangbiao" style="left:0px;"></span>
                </div>
            </div>
            <a href="/user/security" class="forgrtPassword">忘记密码？</a>

            <div class="buts">
                <div class="buts-left" id="cancel1">取消</div>
                <button class="buts-right" id="determine1">确定</button>
            </div>
        </div>
    </div>
</div>
<div class="rebox" style="height: 198%">
    <div class="popup">
        <div class="popup-title">
            <span>登录网上银行充值</span>
            <img src="/img/close-icon.png" id="popupclose">
        </div>
        <div class="popup-content">
            <span>
                请您在新打开的网上银行页面进行充值，充值完成前不要关闭该窗口
            </span>

            <div class="popup-botton">
                <a href="/user/assets">
                    <button>已完成充值</button>
                </a>
                <a href="/problem?0?5?7">
                    <button>充值遇到问题</button>
                </a>
            </div>
        </div>
    </div>
</div>
<#include "/include/smalldetails.ftl">
<#include "/include/footer.ftl">
</body>
</html>